<template>
  <el-container class="home">
    <el-header class="titleArea">
      <Banner />
    </el-header>
    <el-container>
      <el-aside>
        <AsideMenu />
      </el-aside>
      <el-main class="mainArea">
        <router-view></router-view>
      </el-main>
    </el-container>
  </el-container>
</template>

<script lang="ts" setup>
import { onMounted, onUnmounted, watch, nextTick } from 'vue';
import { useUserStore } from '@/stores/userStore';
import { Banner, AsideMenu } from '@/components/Home';
const userStore = useUserStore();

onMounted(async () => {
  // 用户上线
  await userStore.userLinein();

})
onUnmounted(() => {
  nextTick(() => {
    // 用户下线
    userStore.userLineOut()
  })


})
</script>
<style lang="less">
@import url("@/assets/css/home.less");
</style>
